<template>
	<div>
		<div class="intro">
			<div class="container">
				<p>输入主题并选择人数，分享页面给群好友</p>
				<p>系统随机分配给各个小伙伴顺序</p>
			</div>
		</div>
		<div class="mainBox">
			<div class="container">
				<div class="inp">
					<u--input placeholder="请输入主题" border="surround" v-model="zhuti"></u--input>
				</div>
				<u-gap height="8" bgColor="#eee" marginTop="10" marginBottom="10"></u-gap>
				<u-cell-group :border="false">
					<u-cell icon="setting-fill" title="参与人数">
						<u-number-box slot="right-icon" integer v-model="n"></u-number-box>
					</u-cell>
				</u-cell-group>
				<div class="uploadImg">
					<h4>教室分布图</h4>
					<div class="uploadIcon"  @click="uploadImg()">
						<image v-if="imgInfo" :src="imgInfo" @click="showImg(imgInfo)"></image>
						<u-icon v-else name="photo" color="#ccc" size="60"></u-icon>
					</div>
				</div>
				<div class="uploadExcel" @click="chooseExcel">
					上传名单excel
				</div>
				<u-gap height="8" bgColor="transparent" marginTop="10" marginBottom="10"></u-gap>
				<u-button @click="make()" text="马上发布" color="linear-gradient(45deg, #feb692, #ea5455)"></u-button>
			</div>
			<u-toast ref="uToast"></u-toast>
			<div class="loadBox" v-if="searchLoading">
				<u-loading-icon size="36" mode="circle" :vertical="true" color="red" text="加载中..." textSize="20"></u-loading-icon>
			</div>
		</div>
	</div>
</template>

<script>
	const db = wx.cloud.database()
	export default {
		name: 'headcomd',
		data() {
			return {
				wxCode: "",
				openid: "",
				zhuti: "",
				n: 2,
				imgList: [
					
				],
				jsimg: "",
				imglink:"",
				imgInfo:"",
				searchLoading: false
			};
		},
		
		onLoad(options) {
			if (!options) {
				this.infoScene = 'default';
			} else {
				
			}
		},
		computed: {
			
		},
		mounted() {
			
		},
		watch: {
			
		},
		created() {
			let that = this;
			var openid = wx.getStorageSync("useropenid");
			console.log(openid)
			if(openid){
				that.openid = openid
			}else{
				that.getopenid()
			}
			
		},
		methods: {
			getopenid(){
				let that = this
				wx.cloud.callFunction({
					name: 'getopenid',
					data: {},
					complete: res => {
						console.log('callFunction result: ', res)
						that.saveOpenid(res.result.openid)
					}
				})
			},
			saveOpenid(openid){
				db.collection("user_info").where({
					openid: openid
				})
				.get({
					success: function(res){
						console.log('success: ', res)
						if(res.data.length == 0){
							db.collection("user_info").add({
							    data: {
									openid: openid,
									time: new Date()
							    },
								success: function(res) {
								    console.log("openid储存成功" + openid)
									wx.setStorageSync("useropenid",openid)
								}
							})
						}else{
							console.log("openid已储存" + openid)
							wx.setStorageSync("useropenid",openid)
						}
					}
				})
			},
			uploadImg(){
				let that = this
				that.searchLoading = true
				wx.chooseImage({
					count: 1, // 默认9
					sizeType: ['compressed'], // 可以指定是原图还是压缩图，默认二者都有
					sourceType: ['album'], // 可以指定来源是相册还是相机，默认二者都有
					success: function(res) {
						// 返回选定照片的本地文件路径列表，tempFilePath可以作为img标签的src属性显示图片
						var tempFilePaths = res.tempFilePaths
						that.imgs = tempFilePaths
						that.upLoadImage()
						
					},
					fail:function(req){
						console.log(req)
					}
				})
			},
			upLoadImage() {
				let that = this
				wx.showLoading({
					title: '图片上传中',
				})
				wx.uploadFile({
					url: 'https://www.baixuemianshi.com/zhuanti/daka/xcx2.php', //仅为测试地址，填写你的url即可
					filePath: that.imgs[0],
					name: 'file',
					success: function(res) {
						let img = JSON.parse(res.data)
						that.imgInfo = 'https://www.baixuemianshi.com/zhuanti/daka/upload/' + img.data
						// that.addPath(JSON.parse(res.data))
						that.searchLoading = false
					},
					error: function(res) {
						console.log("上传失败!")
					},
				})
				wx.hideLoading();
			},
			make(){
				let that = this
				if(that.zhuti == ""){
					that.showToast('error','请输入主题')
					return
				}
				if(that.n < 2){
					that.showToast('error','最少为2人')
					return
				}
				wx.showToast({
					title: "生成中",
					icon: "loading",
					duration: 5000
				})
				db.collection("paixu_danpai").add({
				    data: {
						zhuti: that.zhuti,
						nums: that.n,
						jsimg: that.imgInfo,
						time: new Date()
				    },
					success: function(res) {
					    console.log(res)
						wx.hideToast()
						uni.navigateTo({
							url: './paixu_join?wyz=' + res._id
						})
					}
				})
			},
			//选择excel表
			chooseExcel(e){
			    let that = this;
				console.log(1)
			    wx.chooseMessageFile({
					count: 1,
					type: 'file',
					success: (result) => {
						console.log("选择Excel表成功！",result);
						let path = result.tempFiles[0].path;
							//that.uploadExcel(path);//调用上传Excel到云存储的方法
					},
					fail: (res) => {},
					complete: (res) => {},
				})
			},
			showToast(type, info) {
				this.$refs.uToast.show({
					type: type,
					icon: false,
					title: '失败主题',
					message: info,
				})
			},
			deletePic(){
				this.imgList = []
			},
			showImg(img){
				wx.previewImage({
					urls: [img], //需要预览的图片http链接列表，注意是数组
					current: '', // 当前显示图片的http链接，默认是第一个
					success: function(res) {},
					fail: function(res) {},
					complete: function(res) {}
				});
			}
		}
	};
</script>

<style>
	@import url(./index.css);
</style>
